<!DOCTYPE html>
<html>
  <head>
    <title>JsLisp test</title>
    <meta charset="utf-8">
    <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0, maximum-scale=1.0" />
    <link rel="stylesheet" type="text/css" href="style.css" />
  </head>
  <body>
    <h1>JsLisp test</h1>

    <form onsubmit="compileAndRun(this.exp.value); return false;">
      <textarea id="exp" cols="80" rows="8" style="font-size:14px; font-family:Consolas,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New, monospace;">
(defun fact (n)
  (if (&lt;= n 1)
      1
    (* n (fact (- n 1)))))

(fact 10)
</textarea>
      <input type="submit" value="Compile & run">
    </form>

    <h3>Output</h3>
    <div id="terminal">
    </div>

    <script type="text/javascript" src="../../lisp2js.js"></script>
    <script type="text/javascript">
      function print(str) {
        var terminalNode = document.getElementById('terminal');
        var div = document.createElement('div');
        div.appendChild(document.createTextNode(str));
        terminalNode.appendChild(div);
      }
      // Intercept Lisp output.
      LISP._output = print;

      function compileAndRun(code) {
        var stream = new LISP.StrStream(code);
        for (;;) {
          var s = LISP.read(stream);
          if (s === undefined)
            break;
          var compiled = LISP.compile(s);
          var result = eval(compiled);
          print(compiled + ' ==> ' + result);
        }
      }
    </script>

    <script src="jslisp.js">
;; Hello world
(print "Hello, world!")
    </script>

    <script src="jslisp.js">
;; Call JavaScript function
;; `JS` is JavaScript global hash table.
;; Can access with 'dot'
(JS.alert "Input expression and press [Compile & run] button")
    </script>
  </body>
</html>
